<template>
  <a-modal
    title="编辑用户"
    v-model="$parent.showModel"
    @ok="save"
    @cancel="cancel"
    okText="保存"
    cancelText="取消"
    :width="836"
  >
    <a-form :form="form">
      <a-row :gutter="24">
        <a-col :span="8">
          <a-form-item
            :label-col="formItemLayout.labelCol"
            :wrapper-col="formItemLayout.wrapperCol"
            label="原籍省"
          >
            <a-select  placeholder="请选择原籍省">
              <a-select-option v-for="province in []" :key="province">{{province}}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label-col="formItemLayout.labelCol"
            :wrapper-col="formItemLayout.wrapperCol"
            label="原籍市"
          >
            <a-select placeholder="请选择原籍市">
              <a-select-option v-for="province in []" :key="province">{{province}}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label-col="formItemLayout.labelCol"
            :wrapper-col="formItemLayout.wrapperCol"
            label="原籍区"
          >
            <a-select placeholder="请选择原籍区">
              <a-select-option v-for="province in []" :key="province">{{province}}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24">
        <a-col :span="24">
          <a-form-item
            :label-col="{ span: 2 }"
            :wrapper-col="{ span: 22 }"
            label="原籍地址"
          >
            <a-input placeholder="原籍地址" />
          </a-form-item>
        </a-col>
      </a-row>
      
      <a-row :gutter="24">
        <a-col :span="8">
          <a-form-item
            :label-col="formItemLayout.labelCol"
            :wrapper-col="formItemLayout.wrapperCol"
            label="现居省"
          >
            <a-select placeholder="请选择现居省">
              <a-select-option v-for="province in []" :key="province">{{province}}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label-col="formItemLayout.labelCol"
            :wrapper-col="formItemLayout.wrapperCol"
            label="现居市"
          >
            <a-select placeholder="请选择现居市">
              <a-select-option v-for="province in []" :key="province">{{province}}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label-col="formItemLayout.labelCol"
            :wrapper-col="formItemLayout.wrapperCol"
            label="现居区"
          >
            <a-select placeholder="请选择现居区">
              <a-select-option v-for="province in []" :key="province">{{province}}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24">
        <a-col :span="24">
          <a-form-item
            :label-col="{ span: 2 }"
            :wrapper-col="{ span: 22 }"
            label="现居地址"
          >
            <a-input placeholder="请填写现居地址" />
          </a-form-item>
        </a-col>
      </a-row>
      <a-form-item v-show="false">
        <a-input v-decorator="['id']" />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script>
const formItemLayout = {
  labelCol: { span: 7 },
  wrapperCol: { span: 17 }
};
export default {
  data() {
    return {
      formItemLayout,
      form: this.$form.createForm(this)
    };
  },
  created() {},
  methods: {
    save() {
      this.form.validateFields(async (err, values) => {
        if (err) return;
        let result = await this.$post("/system/user/save", values);
        if (result.error) return;
        this.$notification.success({
          message: "保存成功"
        });
        this.form.resetFields();
        this.$parent.showModel = false;
        if (values.id) {
          let index = this.$parent.data.findIndex(v => v.id == values.id);
          this.$parent.data.splice(index, 1, result.data);
          return;
        }
        this.$parent.dataCount += 1;
        if (this.$parent.pageIndex == 1) {
          this.$parent.data = [result.data].concat(this.$parent.data);
        }
        if (this.$parent.data.length > 38) {
          this.$parent.data.pop();
        }
      });
    },
    cancel() {
      this.form.resetFields();
      this.$parent.showModel = false;
    }
  }
};
</script>
